<template>
  <div id="advancedSearch-List" class="webheart">
    <div v-if="politicalPoints.name && politicalType == false">
      <div class="pPoints clearfix">
        <p class="fl">
          <span class="title">您探索的内容是：</span>
          {{ politicalPoints.name }} &nbsp; > &nbsp;
          {{ politicalPoints.cName }} &nbsp; > &nbsp;
          <span>{{ politicalPoints.childName }}</span>
        </p>
        <p class="fr" @click="clearPoints()">
          <i class="el-icon-close"></i>
        </p>
      </div>
      <div v-show="politicalPoints.childList">
        <span>相关：</span>
        <el-tag
          type="danger"
          v-for="v in politicalPoints.childList"
          :key="v.id"
          >{{ v.name }}</el-tag
        >
      </div>
    </div>
    <div class="seach-btn" v-if="politicalType == false">
      <el-input
        placeholder="请输入内容"
        v-model="listQuery.content"
        class="input-with-select"
      >
        <el-select
          v-model="select"
          slot="prepend"
          placeholder="请选择"
          @change="setFile()"
        >
          <el-option
            v-for="v in searchLeftFileData"
            :key="v.value"
            :label="v.label"
            :value="v.value"
          ></el-option>
        </el-select>
        <el-button
          slot="append"
          icon="el-icon-search"
          @click="getAllLibrary()"
          v-if="select == 0"
        ></el-button>
        <el-button
          slot="append"
          icon="el-icon-search"
          @click="setFile()"
          v-else
        ></el-button>
      </el-input>
    </div>
    <div class="seach-tab" v-loading="loading">
      <div v-if="politicalType == false">
        <p class="seach-totol" v-if="select != 0">
          <el-badge class="mark" :value="pageObj3.count" />
        </p>
        <div v-else>
          <p class="seach-totol" v-if="listQuery.fiterId1 == 1">
            <el-badge class="mark" :value="pageObjCountAll" />
          </p>
          <p class="seach-totol" v-if="listQuery.fiterId1 == 2">
            <el-badge class="mark" :value="pageObj2CountAll" />
          </p>
        </div>
        <el-tabs
          v-model="active"
          type="card"
          @tab-click="handleCheckedCitiesChange"
        >
          <el-tab-pane
            v-for="(v, index) in tabHedList2"
            :key="index"
            :label="v.name + v.num"
            :name="v.type"
          ></el-tab-pane>
        </el-tabs>
      </div>

      <!-- <div class="alldiv" @click="setAllLibrary" :class="showLibraryType?'activeLibrary':''">
                 {{showLibraryType?'全部内容':''}}
            </div>
             <el-checkbox-group v-model="active"    >
                <el-checkbox-button v-for="v in tabHedList" :label="v.type" :key="v.type">{{v.name+v.num}}</el-checkbox-button>
            </el-checkbox-group>-->

      <div v-if="politicalType == false">
        <div></div>
        <div class="seach-type-text">
          <div class="clearfix text-ul" v-show="filterShow1">
            <p class="fl label">检索粒度：</p>
            <p class="fl name">
              <span
                v-for="v in contentData"
                :key="v.id"
                :class="[{ active: v.id == listQuery.fiterId1 }]"
                @click="activeClick('fiterId1', v.id, 1)"
                >{{ v.name }} {{ '(' + v.num + ')' }}</span
              >
            </p>
          </div>
          <div v-show="active != '-1'">
            <div
              class="clearfix text-ul"
              v-show="
                filterShow2 &&
                listQuery.fiterId1 == 1 &&
                trainingLevel.length > 0
              "
            >
              <p class="fl label">培训层次：</p>
              <p class="fl name">
                <span
                  v-for="v in trainingLevel"
                  :key="v.id"
                  :class="[{ active: v.id == listQuery.trainingLevel }]"
                  @click="activeClick('trainingLevel', v.id)"
                  v-if="v.num != '(0)'"
                >
                  <i>{{ v.name }}{{ v.num }}</i>
                </span>
              </p>
            </div>
            <div
              class="clearfix text-ul"
              v-show="filterShow3 && deptData.length > 0"
            >
              <p class="fl label">提供单位：</p>
              <p class="fl name">
                <span
                  v-for="v in deptData"
                  :key="v.id"
                  :class="[{ active: v.id == listQuery.sourceUnit }]"
                  @click="activeClick('sourceUnit', v.id)"
                  v-if="v.num != '(0)'"
                >
                  <i>{{ v.name }}{{ v.num }}</i>
                </span>
              </p>
            </div>
            <div
              class="clearfix text-ul"
              v-show="
                filterShow4 && listQuery.fiterId1 == 1 && labelData.length > 0
              "
            >
              <p class="fl label">资源分类：</p>
              <p class="fl name">
                <span
                  v-for="v in labelData"
                  :key="v.id"
                  :class="[{ active: v.id == listQuery.labelValue }]"
                  @click="activeClick('labelValue', v.id)"
                  v-if="v.num != '(0)'"
                >
                  <i>{{ v.name }}{{ v.num }}</i>
                </span>
              </p>
            </div>
          </div>
          <div class="clearfix text-ul">
            <p class="fl label">资源时间范围：</p>
            <p class="fl yesrD">
              <el-date-picker
                v-model="listQuery.sdate"
                type="year"
                value-format="yyyy"
                placeholder="开始年份"
              ></el-date-picker>
              <span>&nbsp;&nbsp; - &nbsp;&nbsp;</span>
              <el-date-picker
                v-model="listQuery.edate"
                type="year"
                value-format="yyyy"
                placeholder="结束年份"
              ></el-date-picker>
            </p>
          </div>

          <div class="totle" v-if="select != 0">
            <p>&gt;&gt; 共 {{ pageObj3.count }} 条数据 &lt;&lt;</p>
          </div>
          <div v-else>
            <div class="totle" v-if="listQuery.fiterId1 == 1">
              <p>&gt;&gt; 共 {{ pageObj.count }} 条数据 &lt;&lt;</p>
            </div>
            <div class="totle" v-if="listQuery.fiterId1 == 2">
              <p>&gt;&gt; 共 {{ pageObj2.count }} 条数据 &lt;&lt;</p>
            </div>
          </div>
        </div>
      </div>
      <div class="seach-type-text" v-if="politicalType == true">
        <div class="totle">
          <p>&gt;&gt; 共 {{ pageObj2.count }} 条数据 &lt;&lt;</p>
        </div>
      </div>
      <div class="seach-content">
        <div v-show="select == 0">
          <!-- 课程列表 -->
          <div v-if="fiterId1 == 1">
            <div class="contentData2">
              <CourseList
                v-if="tableData.length"
                :tableData="tableData"
                showType="true"
              />
            </div>
            <Pagination
              v-show="parseInt(pageObj.count) > 0"
              :total="parseInt(pageObj.count)"
              @change="getList"
              :page.sync="listQuery.page"
              :limit.sync="listQuery.limit"
            />
            <el-empty
              v-if="tableData.length == 0"
              description="暂无数据"
            ></el-empty>
          </div>

          <!-- 知识点列表 -->
          <div v-if="fiterId1 == 2">
            <div
              class="list--wrap-item clearfix contentData1"
              @click="toKnowledgeDetail(v)"
              v-for="v in tableData2"
              :key="v.id"
            >
              <div class="category-labels">
                <p>{{ v.type | fiterCategoryLabels }}</p>
              </div>

              <div class="fl r-txt knowledgeDetail">
                <p class="line"></p>
                <p class="title one-ellipsis">
                  {{ v.type == 1 ? '知识点名称' : '资源名称' }}:
                  <span v-html="v.name">{{ v.name }}</span>
                </p>
                <p>
                  所属章节：
                  <span v-if="v.sysKnowledgeChapterList[0]">
                    <span
                      v-html="
                        v.sysKnowledgeChapterList[0].courseChapterName
                          ? v.sysKnowledgeChapterList[0].courseChapterName
                          : '无'
                      "
                    ></span>
                  </span>
                </p>
                <div class="txt-info">
                  <p class="txt-row clearfix">
                    <span>
                      <span class="row-name">作者：</span>
                      <span
                        class="row-cont col"
                        v-html="v.author ? v.author : ''"
                      ></span>
                    </span>
                  </p>

                  <p class="txt-row">
                    <span class="row-name">关联思政点：</span>
                    <span class="row-cont col" v-html="v.elementArr">{{
                      v.elementArr
                    }}</span>
                  </p>
                </div>
                <div class="file-count">
                  <span
                    class="file-title"
                    :class="[v.IntroductionShow ? 'file-on' : '']"
                    >附件资源：</span
                  >
                  <FileCountPro :data="v.sysKnowledgeFilesVO" />

                  <el-popover placement="right" width="400" trigger="hover">
                    <div>
                      <el-descriptions title v-if="v.type == 1">
                        <el-descriptions-item label="课程思政目标">{{
                          v.eduTarget ? v.eduTarget : '无'
                        }}</el-descriptions-item>
                      </el-descriptions>
                      <el-descriptions title v-if="v.type == 1">
                        <el-descriptions-item label="融入策略建议">
                          <span v-if="v.strategy" v-newhtml="v.strategy"></span>
                          <span v-else>无</span>
                        </el-descriptions-item>
                      </el-descriptions>

                      <el-descriptions title>
                        <el-descriptions-item label="素材名称">{{
                          v.resName ? v.resName : '无'
                        }}</el-descriptions-item>
                      </el-descriptions>
                      <el-descriptions title>
                        <el-descriptions-item label="素材简介">
                          <span v-if="v.resDes" v-newhtml="v.resDes"></span>
                          <span v-else>无</span>
                        </el-descriptions-item>
                      </el-descriptions>
                    </div>

                    <p class="knowledge-del" slot="reference" @click.stop
                      >详情 >></p
                    >
                  </el-popover>
                </div>
                <div class="look-down">
                  <LookDown txtShow />
                </div>
              </div>
              <div style="clear: both"></div>
              <div class="line"></div>
            </div>

            <Pagination
              v-show="parseInt(pageObj2.count) > 0"
              :total="parseInt(pageObj2.count)"
              @change="getList"
              :page.sync="listQuery.page"
              :limit.sync="listQuery.limit"
            />
            <el-empty
              v-if="tableData2.length == 0"
              description="暂无数据"
            ></el-empty>
          </div>
        </div>

        <!-- 文本类显示 -->

        <div v-show="select == 1 || select == 2 || select == 3">
          <el-row :gutter="20">
            <el-col :span="4" v-for="v in fileData" :key="v.id">
              <div class="fileItem-tab-li">
                <div class="li-wrap">
                  <p class="li-file-type" v-show="select == 2">
                    <i
                      class="el-icon-picture-coverImg"
                      v-show="select == 2"
                      title="点击预览"
                    >
                      <img
                        :src="coverImgFile(v)"
                        @click="handleLook(v)"
                        class="fl"
                      />
                    </i>
                  </p>
                  <p
                    class="li-file-type"
                    v-show="select == 1"
                    @click="handleLook(v)"
                  >
                    <i class="el-icon-s-order"></i>
                  </p>
                  <p
                    class="li-file-type file-Video"
                    v-show="select == 3"
                    @click="handleLook(v)"
                    title="点击预览"
                  >
                    <!-- <i class="el-icon-video-camera-solid"   ></i> -->
                    <template v-if="v.httpUrl">
                      <!-- <Video :videoUrl="v.httpUrl"></Video> -->
                      <video :src="v.httpUrl"></video>
                      <span class="video-shaow"></span>
                    </template>
                  </p>
                </div>
                <p
                  class="kb-info one-ellipsis"
                  :title="v.oldName"
                  v-html="v.oldNameRed ? v.oldNameRed : '无'"
                  >{{ v.oldNameRed }}</p
                >
                <p class="material-details clearfix">
                  <span
                    class="fl"
                    :class="[v.IntroductionShow ? 'file-on' : '']"
                    >素材资料</span
                  >
                  <span
                    class="fr shopping"
                    @click="setAddSysResourceCar(v, $event)"
                  >
                    <i class="el-icon-shopping-cart-full"></i>加入资源车
                  </span>
                </p>
                <p class="clearfix d-info">
                  <span class="fl">
                    <i class="el-icon-date"></i>
                    {{ v.createTime | timecycleYMD }}
                  </span>
                  <span class="fr" @click="setDownload(v.oldName, v.httpUrl)">
                    <i class="el-icon-download"></i>下载
                  </span>
                  <!-- <span class="fr" @click="setPreviewShow(v.httpUrl)"  v-if="select == 2 || select == 3"
                                        ><i class="el-icon-download" ></i>预览</span
                                    >-->
                </p>
              </div>
            </el-col>
          </el-row>
          <Pagination
            v-show="parseInt(pageObj3.count) > 0"
            :total="parseInt(pageObj3.count)"
            @change="getFile"
            :page.sync="listQueryFile.page"
            :limit.sync="listQueryFile.limit"
          />
          <el-empty
            v-if="fileData.length == 0"
            description="暂无数据"
          ></el-empty>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getSession, setSession } from '@/utils/session'
import {
  openApiSysTrainingLevelQuery,
  openApiSysDeptQuery,
  openApiSysLabelQuery,
  openApiSysCourseSearch,
  openApiSysCourseQuery,
  openApiSysCourseFiles,
} from '@/api/openApi'
import setInfo from '@/mixins/setInfo.js'
import CourseList from '@/components/home/courseList.vue'
import { KnowledgeSetInfo } from '@/views/Admin/courseLibrary/mixins/KnowledgeSetInfo'
import Bus from '@/utils/bus.js'
import initData from './initData'
export default {
  mixins: [setInfo, KnowledgeSetInfo, initData],
  components: {
    LookDown: () => import('@/components/home/lookDown.vue'),
    FileCountPro: () => import('@/components/home/fileCountPro.vue'),
    CourseList,
  },
  data() {
    return {
      loading: true,
      active: '-1',
      // tabHedList: [
      //   {
      //     name: '全部内容',
      //     type: '-1',
      //     num: '',
      //   },
      //   {
      //     name: '课程库',
      //     type: '1',
      //     num: '',
      //   },
      //   {
      //     name: '专业库',
      //     type: '2',
      //     num: '',
      //   },
      //   {
      //     name: '兵种库',
      //     type: '3',
      //     num: '',
      //   },
      //   {
      //     name: '专题库',
      //     type: '4',
      //     num: '',
      //   },
      //   {
      //     name: '示范微视频',
      //     type: '5',
      //     num: '',
      //   },
      //   {
      //     name: '培训资源',
      //     type: '6',
      //     num: '',
      //   },
      // ],
      tabHedList2: [],
      date: '',

      listQuery: {
        page: 1,
        limit: 8,
        content: '', //  搜索内容
        courseType: '', //  	课程类型
        edate: '', //  	结束日期
        sdate: '', //  	开始日期
        eduId: '', //  	思政体系
        labelValue: '-1', //  	课程标签
        sourceUnit: '-1', //  	提供单位
        trainingLevel: '-1', //  	培训层次
        fiterId1: '1', //内容相关 1课程 2知识点
      },
      tableData: [],
      pageObj: {},
      listQueryAll: {
        page: 1,
        limit: 99,
      },
      contentData: [
        {
          id: '1',
          name: '课程 | 专业 | 专题',
          num: 0,
        },
        {
          id: '2',
          name: '知识点 | 素材',
          num: 0,
        },
      ],
      deptData: [
        {
          id: '',
          name: '全部',
        },
      ],
      labelData: [
        {
          id: '',
          name: '全部',
        },
      ],
      trainingLevel: [
        {
          id: '',
          name: '全部',
          num: 0,
        },
      ],
      // fileData: [
      //   {
      //     id: '-1',
      //     name: '全部',
      //   },
      //   {
      //     id: '1',
      //     name: '文本',
      //   },
      //   {
      //     id: '2',
      //     name: '图片',
      //   },
      //   {
      //     id: '3',
      //     name: '视频',
      //   },
      // ],
      fiterId1: '1',
      fiterId2: '-1',
      fiterId3: '-1',
      fiterId4: '-1',
      fiterId5: '-1',
      searchType: '',
      politicalPoints: {
        name: '',
        cName: '',
        childName: '',
        id: '',
      },
      checkAll: false,
      cities: this.tabHedList,
      isIndeterminate: true,
      showLibraryType: false,
      activeLibraryTxt: '',
      pageObj2: {},
      tableData2: [],
      select: '0',
      filterShow1: true,
      filterShow2: true,
      filterShow3: true,
      filterShow4: true,
      num: 0,
      listQueryFile: {
        page: 1,
        limit: 12,
      },
      pageObj3: {},
      fileData: [],
      seachTotol: '0',
      introductionData: {},
      dialogPreview: false,
      dialogPreviewUrl: '',
      totalRefreshType: false,
      pageObjCountAll: 0,
      pageObj2CountAll: 0,
      labelTypeShow: false,
      politicalType: false,
    }
  },
  computed: {},
  watch: {
    $route(to, from) {
      this.totalRefreshType = false
      this.getloadingData()
    },
    monitor() {
      this.totalRefreshType = false
      this.getloadingData()
    },
  },
  computed: {
    monitor() {
      return this.$store.getters.politicalData
    },
  },
  mounted() {
    window.scrollTo(0, 0)
    this.politicalType = this.$route.query.politicalType ? true : false
    // console.log(this.$slots)

    this.getloadingData()
  },
  methods: {
    getloadingData() {
      this.listQuery.content = this.$route.query.keyword
      this.listQuery.page = 1
      this.listQuery.labelValue = '-1'
      this.listQuery.sourceUnit = '-1'
      this.listQuery.trainingLevel = '-1'
      this.active = '-1'

      if (this.$route.query.points) {
        this.listQuery.content = ''
        this.listQuery.fiterId1 = this.$route.query.points
        this.politicalPoints = this.$store.getters.politicalData

        if (this.politicalPoints.childId == '') {
          var clist = []
          this.politicalPoints.childList.forEach((e) => {
            clist.push(e.id)
          })
          this.listQuery.eduId = clist.join(',')
        } else {
          this.listQuery.eduId = this.politicalPoints.childId
        }
      }
      if (this.$route.query.textType) {
        this.select = this.$route.query.textType
        if (this.select == 0) {
          this.getLabelQuery(1)
          this.getTrainingLevel()
        } else {
          this.filterShow1 = false
          this.getFile()
        }
      } else {
        this.getTrainingLevel()
        this.getLabelQuery(1)
      }
    },
    // 文本类数据
    getFile() {
      var type = ''
      if (this.select == '0') {
        type = ''
      }
      if (this.select == '1') {
        type = 'txt,doc,docx,ppt'
      }
      if (this.select == '2') {
        type = 'jpg,png'
      }
      if (this.select == '3') {
        type = 'mp4'
      }
      var active = this.active
      var data = {
        page: this.listQueryFile.page,
        limit: this.listQueryFile.limit,
        content: this.listQuery.content, //  搜索内容
        fileType: type,
        courseType: active == '-1' ? '' : active,
      }
      this.loading = true
      this.tabHedList2 = this.tabHedList
      openApiSysCourseFiles(data).then((res) => {
        this.fileData = res.data.data[0].fileData

        this.fileData.forEach((e) => {
          e.oldNameRed = e.oldName
        })
        this.setSearcHighlight(this.fileData, 3)
        this.pageObj3 = res.data.data[0]
        setTimeout(() => {
          this.loading = false
        }, 300)
      })
    },
    getList() {
      if (this.listQuery.edate < this.listQuery.sdate) {
        this.$message.error('结束年份不得大于开始年份，请从新选择')
      }
      let cType = this.active

      if (this.num == 0) {
        this.num = 1
        if (this.$route.query.searchType) {
          cType = this.$route.query.searchType
        }
      }
      var data = {
        page: this.listQuery.page,
        limit: this.listQuery.limit,
        content: this.listQuery.content, //  搜索内容
        courseType: cType, //  	课程类型
        sdate: this.listQuery.sdate, //  	开始日期
        edate: this.listQuery.edate, //  	结束日期
        eduId: this.listQuery.eduId, //  	思政体系
        labelValue: this.listQuery.labelValue, //  	课程标签
        sourceUnit: this.listQuery.sourceUnit, //  	提供单位
        trainingLevel: this.listQuery.trainingLevel, //  	培训层次
      }

      data.trainingLevel = data.trainingLevel == '-1' ? '' : data.trainingLevel
      data.sourceUnit = data.sourceUnit == '-1' ? '' : data.sourceUnit
      data.labelValue = data.labelValue == '-1' ? '' : data.labelValue
      data.courseType = data.courseType == '-1' ? '' : data.courseType
      this.loading = true
      openApiSysCourseSearch(data).then((res) => {
        this.fiterId1 = this.listQuery.fiterId1

        this.tableData = res.data.data[0].data
        this.tableData.forEach((e) => {
          e.teams = this.teamInfo(e)
        })
        this.setSearcHighlight(this.tableData, 1)

        this.pageObj = res.data.data[0]

        this.tableData2 = res.data.data[0].knowledgeVO.data
        this.tableData2.forEach((e) => {
          e.elementArr = this.educationList(e)
        })
        this.setSearcHighlight(this.tableData2, 2)

        this.pageObj2 = res.data.data[0].knowledgeVO

        let dataALL = res.data.data[0]
        this.contentData[0].num = this.pageObj.count
        this.contentData[1].num = this.pageObj2.count
        if (this.labelTypeShow == false) {
          this.setNum(this.labelData, this.pageObj.labelTypeVO, 'labelData')
          this.setNum(this.deptData, dataALL.deptTypeVO, 'deptData')
          this.setNum(
            this.trainingLevel,
            dataALL.trainingTypeVO,
            'trainingLevel',
          )

          this.labelTypeShow = true
        }
        this.tabHedList2 = this.tabHedList
        if (this.totalRefreshType == false) {
          this.pageObjCountAll = this.pageObj.count
          this.pageObj2CountAll = this.pageObj2.count
          if (this.listQuery.fiterId1 == 1) {
            this.setNum(this.tabHedList, dataALL.courseTypeVO)
          }
          if (this.listQuery.fiterId1 == 2) {
            this.setNum(this.tabHedList, this.pageObj2.courseTypeVOList)
          }
          this.totalRefreshType = true
        }
        setTimeout(() => {
          this.loading = false
        }, 300)
      })
    },

    // 高亮显示  课程1
    setSearcHighlight(data, type) {
      if (!this.listQuery.content && !this.politicalPoints.name) return false

      //课程
      if (type == 1) {
        data = data.map((item) => {
          item.IntroductionShow = true
          let title = this.filterReplace(item.title)
          if (title !== item.title) {
            item.IntroductionShow = false
          }
          let teams = this.teamInfo(item)
          teams = this.filterReplace(teams)

          if (teams !== this.teamInfo(item)) {
            item.IntroductionShow = false
          }
          item.title = title
          item.teams = teams
          return item
        })
      }
      // 知识点
      if (type == 2) {
        data = data.map((item, index) => {
          item.IntroductionShow = true
          let name = this.filterReplace(item.name)
          if (name !== item.name) {
            item.IntroductionShow = false
          }
          item.name = name

          if (item.sysKnowledgeChapterList[0]) {
            let courseChapterName = ''
            if (item.sysKnowledgeChapterList[0].courseChapterName) {
              courseChapterName = this.filterReplace(
                item.sysKnowledgeChapterList[0].courseChapterName,
              )
              if (
                courseChapterName !==
                item.sysKnowledgeChapterList[0].courseChapterName
              ) {
                item.IntroductionShow = false
              }
            }

            item.sysKnowledgeChapterList[0].courseChapterName =
              courseChapterName
          }

          let author = this.filterReplace(item.author)
          if (author !== item.author) {
            item.IntroductionShow = false
          }
          item.author = author

          let elementArr = this.educationList(item)

          elementArr = this.filterReplace(elementArr)
          if (elementArr !== this.educationList(item)) {
            item.IntroductionShow = false
          }
          if (this.politicalPoints.childList) {
            elementArr = this.filterReplaceArr(item)
            if (elementArr !== this.educationList(item)) {
              item.IntroductionShow = false
            }
          }

          item.elementArr = elementArr

          return item
        })
      }
      // 文件
      if (type == 3) {
        data = data.map((item, index) => {
          item.IntroductionShow = true
          let oldName = this.filterReplace(item.oldName)
          if (oldName !== item.oldName) {
            item.IntroductionShow = false
          }
          item.oldNameRed = oldName
        })
      }
    },
    //高亮替换
    filterReplace(item) {
      if (!item) return false
      let seach = this.listQuery.content
      if (this.listQuery.eduId) {
        seach = this.politicalPoints.childName
      }
      let txt = item
      if (seach) {
        let reg = new RegExp(seach, 'g')
        txt = item.replace(reg, "<span style='color:red'>" + seach + '</span>')
      }

      return txt
    },

    //高亮替换  多个思政元素
    filterReplaceArr(item) {
      if (!item) return false
      let seach = ''
      let txt = JSON.parse(JSON.stringify(item))
      if (!item.ideologicalEducationList) return false
      let a = item.ideologicalEducationList
      let b = this.politicalPoints.childList
      let arr = [...b].filter((x) => [...a].some((y) => y.id === x.id))

      txt.ideologicalEducationList.forEach((eItem) => {
        arr.forEach((pItem, index) => {
          if (eItem.id == pItem.id) {
            eItem.name = "<span style='color:red'>" + eItem.name + '</span>'
          }
        })
      })

      return this.educationList(txt)
    },

    //筛选数据数量
    setNum(list, data, name) {
      var cont = 0
      var listShow = []

      list.forEach((t) => {
        t.num = '(0)'
        if (t.name == '全部' || t.name == '全部内容') {
          t.num = ''
        }
        if (data) {
          data.forEach((c, index) => {
            if (name == 'trainingLevel') {
            }
            if (t.type == c.type || t.id == c.type) {
              t.num = '(' + c.num + ')'
            }
            if (t.name == '全部' || t.name == '全部内容') {
              t.num = ''
            }
          })
        }
        if (t.num != '(0)') {
          listShow.push(t)
        }
      })
      if (listShow.length == 1 && name) {
        this.$nextTick(() => {
          this[name] = []
        })
      }
    },
    toKnowledgeDetail(row) {
      let { level } = this.$store.getters
      if (level == undefined || level >= 3) {
        this.warnMsg('抱歉，您没有浏览权限')
        return
      }
      let { sysKnowledgeChapterList } = row
      let { courseId, type } = sysKnowledgeChapterList[0]
      this.getCourseInfo(courseId).then((v) => {
        this.$store.commit('SETCURCOURSE', v)
        this.$store.commit('SETKNOLEDGE', row)
        var name = 'knowdedge-detail'
        switch (type) {
          case '1':
            name = 'knowdedge-detail'
            break
          case '2':
            name = 'specialty-knowdedge'
            break
          case '3':
            name = 'arms-knowdedge-home'
            break
          case '4':
            name = 'topic-knowdedge-detail'
            break
          default:
            name = 'knowdedge-detail'
        }
        this.$router.push({
          name: name,
          query: { id: row.id, queryMode: 1 },
        })
      })
    },
    getCourseInfo(id) {
      return new Promise((resolve, reject) => {
        openApiSysCourseQuery({ id })
          .then((res) => {
            resolve(res.data.data[0])
          })
          .catch((error) => {
            reject(error)
          })
      })
    },
    // 培训层次  单位
    getTrainingLevel() {
      this.trainingLevel = []
      this.deptData = []
      openApiSysTrainingLevelQuery(this.listQueryAll).then((res) => {
        this.trainingLevel = res.data.data
        this.trainingLevel.unshift({
          id: '-1',
          name: '全部',
        })
        openApiSysDeptQuery({ pId: 0 }).then((res1) => {
          this.deptData = res1.data.data
          this.deptData.unshift({
            id: '-1',
            name: '全部',
          })

          this.getList()
        })
      })
    },
    //标签
    getLabelQuery(val) {
      let type = val == '-1' ? '' : val
      this.labelData = []
      openApiSysLabelQuery({ type: type }).then((res) => {
        this.labelData = res.data.data
        this.labelData.unshift({
          id: '-1',
          name: '全部',
        })

        this.labelTypeShow = false

        this.getList()
      })
    },
    // 点击tab 切换专业
    handleClick(tab, event) {
      // console.log(tab, event);
      this.fiterId4 = '-1'
      //  this.getLabelQuery();
    },
    //筛选选中 获取id
    activeClick(name, id, type) {
      if (type == 1) {
        this.listQuery.trainingLevel = '-1'
      }
      this.labelTypeShow = true
      this.listQuery[name] = id
      this.getList()
    },

    handleCheckedCitiesChange(val) {
      this.loading = true
      this.listQuery.page = 1
      this.showFiter()
      this.getLabelQuery(this.active)
    },
    showFiter() {
      this.listQuery.labelValue = '-1'
      this.listQuery.sourceUnit = '-1'
      this.listQuery.trainingLevel = '-1'
      if (this.select == 0) {
        if (this.active == 1) {
          this.filterShow2 = true
          this.filterShow3 = true
          this.filterShow4 = true
        }
        if (this.active == 2 || this.active == 4) {
          this.listQuery.trainingLevel = '-1'
          this.listQuery.fiterId1 = 1
          this.filterShow1 = true
          this.filterShow2 = false
          this.filterShow3 = true
          this.filterShow4 = true
        }
        if (this.active == 3 || this.active == 5 || this.active == 6) {
          this.listQuery.fiterId1 = 1
          this.filterShow1 = false
          this.filterShow2 = false
          this.filterShow3 = true
          this.filterShow4 = true
        }
        if (this.active == 6) {
          this.filterShow3 = false
        }
        if (this.active == 3) {
          this.listQuery.fiterId1 = 2
        }
        if (this.active == '-1') {
          this.filterShow1 = true
        }
        this.getList()
      } else {
        this.politicalPoints = {}
        this.listQuery.eduId = ''

        this.filterShow1 = false
        this.filterShow2 = false
        this.filterShow3 = false
        this.filterShow4 = false
        this.getFile()
      }
    },
    //点击搜素图标按钮
    getAllLibrary() {
      this.listQuery.page = 1
      this.active = '-1'
      this.listQuery.fiterId1 = 1
      this.totalRefreshType = false
      this.listQuery.labelValue = '-1'
      this.listQuery.sourceUnit = '-1'
      this.listQuery.trainingLevel = '-1'
      this.getList()
    },
    //清除思政元素
    clearPoints() {
      this.politicalPoints = []
      this.listQuery.eduId = ''
      this.listQuery.page = 1
      this.showFiter()
    },
    // 改变文本类型切换
    changeFile() {
      this.listQuery.content = ''
      this.setFile()
    },
    // 选择文本类型
    setFile() {
      this.listQueryFile.page = 1
      this.listQuery.fiterId1 = 1
      this.totalRefreshType = false
      ;(this.tabHedList = [
        {
          name: '全部内容',
          type: '-1',
          num: '',
        },
        {
          name: '课程库',
          type: '1',
          num: '',
        },
        {
          name: '专业库',
          type: '2',
          num: '',
        },
        {
          name: '兵种库',
          type: '3',
          num: '',
        },
        {
          name: '专题库',
          type: '4',
          num: '',
        },
        {
          name: '示范微视频',
          type: '5',
          num: '',
        },
        {
          name: '培训资源',
          type: '6',
          num: '',
        },
      ]),
        (this.active = '-1')

      this.showFiter()
    },
    // 下载
    setDownload(name, data) {
      var urlObject = window.URL
      var export_blob = new Blob([data])
      var save_link = document.createElement('a')
      save_link.href = urlObject.createObjectURL(export_blob)
      save_link.download = name
      save_link.click()
    },
    // 预览
    setPreviewShow(url) {
      this.dialogPreviewUrl = url
      this.dialogPreview = true
    },

    // 加入资源车
    setAddSysResourceCar(v, e) {
      //把当前事件存入vuex，便于资源车动画调用
      this.$store.commit('SETCURRENTEVENT', e)
      //this.$store.state.webBasicInfo._event;
      if (!this.$store.getters.userId) {
        this.loginTip()
        return
      }
      let arr = []
      v.fileId = v.id
      arr.push(v)
      Bus.$emit('showDialogCarList', arr)
    },
    //点击预览
    handleLook(v) {
      Bus.$emit('showPreview', v, this.fileData)
    },
  },
}
</script>

<style lang="scss">
#advancedSearch-List {
  // width: 1400px;
  margin: 0 auto;
  margin-top: 100px;
  .el-tabs__item.is-active {
    font-weight: 900;
  }
  .el-checkbox-button.is-checked .el-checkbox-button__inner {
    border: 1px solid var(--colorH1);
    background-color: var(--colorH1);
    box-shadow: -1px 0 0 0 #d3a1a1;
  }
  .el-checkbox-button__inner {
    border-bottom: none;
  }

  .el-checkbox-group {
    border-bottom: 1px solid #dcdfe6;
  }
  .pPoints {
    p {
      font-size: 20px;
      span {
        color: var(--colorH1);
        font-weight: 900;
      }
      // .title{
      //     color: #000;
      //     font-size: 20px;
      // }
      i.el-icon-close {
        cursor: pointer;
        color: var(--colorH1);
      }
    }
  }
  .seach-btn {
    margin: 20px 0;
    padding-bottom: 10px;
    .el-input__inner {
      height: 50px;
      line-height: 50px;
      border: 1px solid var(--colorH1);
    }
    i.el-icon-search {
      font-size: 26px;
      color: #fff;
    }
    .el-input-group__append {
      border: 1px solid var(--colorH1);
      background-color: var(--colorH1);
    }
    .el-checkbox-button.is-checked .el-checkbox-button__inner {
      border: 1px solid var(--colorH1);
      background-color: var(--colorH1);
      box-shadow: -1px 0 0 0 #d3a1a1;
    }
  }
  .totle {
    position: absolute;
    right: 50px;
    bottom: -21px;
    width: 160px;
    height: 42px;
    text-align: center;
    font-size: 14px;
    color: #333;
    line-height: 42px;
    background: #fff;
  }
  .seach-type-text {
    padding: 20px;
    border-bottom: 1px solid #d7d7d7;
    position: relative;

    .text-ul {
      margin-bottom: 5px;
      .label {
        font-weight: 900;
        font-size: 16px;
        width: 120px;
      }
      .name {
        width: 85%;

        span {
          display: inline-block;
          margin-right: 5px;
          cursor: pointer;
          margin-bottom: 5px;
          padding: 6px 10px;
          border-radius: 5px;
          font-size: 16px;
        }
        span:hover {
          background: var(--colorH1);
          color: #fff;
        }

        i {
          font-size: 16px;
        }
        .active {
          background: var(--colorH1);
          color: #fff;
        }
        .active:hover {
          color: #fff;
        }
        .active span:hover {
          color: #fff;
        }
      }
    }
  }

  .seach-content {
    width: 100%;
    margin: 0 auto;
    margin-top: 30px;
    padding-bottom: 50px;
    .list--wrap-item {
      padding: 20px;
      cursor: pointer;
      position: relative;
      .line {
        margin-top: 20px;
        width: 100%;
        height: 1px;
        background: #eee;
      }
      .l-img {
        width: 289px;
        height: 170px;
        .cover {
          width: 100%;
          height: 100%;
          display: inherit;
        }
      }
      .r-txt {
        background: #fff;
        width: 100%;
        height: 140px;
        padding: 0 30px;
        position: relative;
        margin-left: 55px;

        .line {
          position: absolute;
          width: 5px;
          height: 85px;
          background: var(--colorH1);
          left: 0;
          top: -16px;
        }
        .file-count {
          position: absolute;
          left: 30px;
          bottom: -16px;
          height: 24px;
          line-height: 24px;
          .file-title {
            float: left;
            color: #333;
          }
          .file-on {
            color: red;
          }
          .knowledge-del {
            cursor: pointer;
            display: inline-block;
            line-height: 23px;
            float: right;
            color: #8c8c8c;
            font-size: 12px;
          }
        }
        .look-down {
          position: absolute;
          right: 40px;
          bottom: -16px;
          height: 24px;
        }
        .title {
          padding-bottom: 15px;
          font-size: 20px;
          font-weight: 900;
          cursor: pointer;
        }
        .col {
          color: #8c8c8c;
        }
        .txt-info {
          margin-top: 10px;

          .txt-row {
            width: 100%;
            margin-bottom: 5px;

            .row-cont {
              width: 90%;
            }
            .four-ellipsis {
              height: 100px;
              line-height: 24px;
            }
          }
        }
      }
      @media screen and (max-width: 1400px) {
        .fl.r-txt.knowledgeDetail {
          width: 90%;
        }
        .l-img {
          width: 98%;
          height: 170px;
        }
      }
    }
  }
  .txt-ico {
    margin-top: 20px;
    color: #aaaaaa;
    i {
      padding-right: 10px;
      font-weight: 900;
    }
    img {
      margin-right: 10px;
    }
    span {
      margin-right: 25px;
    }
    .i-size i {
      font-size: 16px;
    }
  }
  .contentData2 {
    .courseList-list .list--wrap-item .r-txt {
      padding: 0px;
      padding-top: 15px;
      margin-left: 0px;
    }
    .courseList-list .list--wrap-item .r-txt .txt-info {
      margin-top: 0px;
    }
  }

  .seach-tab {
    position: relative;
    .alldiv {
      width: 98px;
      height: 39px;
      text-align: center;
      line-height: 39px;
      position: absolute;
      left: 0;
      top: 0;
      cursor: pointer;
      z-index: 99;
    }
    .activeLibrary {
      color: #fff;
      background: var(--colorH1);
    }
    p.seach-totol {
      position: absolute;
      top: -9px;
      left: 77px;
      z-index: 3;
      sup.el-badge__content {
        font-size: 14px;
        padding: 2px 8px;
        background-color: #f56c6c;
      }
    }
  }
  .fileItem-tab-li {
    // height: 150px;
    border: 1px solid rgb(49, 16, 16);
    padding: 10px;
    margin-bottom: 20px;
    .li-wrap {
      background: #fff;
      height: 120px;
      position: relative;
      .li-file-type {
        text-align: center;
        line-height: 100px;
        i {
          font-size: 50px;
          color: #aaaaaa;
          padding-top: 20px;
        }
        i.el-icon-picture-coverImg {
          padding-top: 0;
          height: 120px;
          img {
            width: 100%;
            height: 100%;
          }
        }
      }
      .li-name {
        position: absolute;
        bottom: 10px;
        left: 10px;
      }
    }
    .kb-info,
    .d-info {
      font-size: 12px;
      padding-top: 10px;
      .fr {
        cursor: pointer;
        padding-left: 10px;
      }
    }
    p.material-details {
      margin-top: 10px;
      cursor: pointer;
      color: #858181;
      font-size: 12px;
      i {
        font-size: 16px;
        font-weight: 900;
      }
      .shopping {
        color: var(--colorH1);
      }
      .file-on {
        color: red;
        cursor: auto;
      }
    }
    p.kb-info.one-ellipsis {
      font-size: 14px;
    }
  }
  .category-labels {
    position: absolute;
    left: 0;
    top: 9px;
    background: #d7d140;
    color: #fff;
    padding: 5px 10px;
    z-index: 2;
    border-radius: 0 50px 50px 0;
    font-size: 16px;
    font-weight: 900;
  }
  .previewImg img {
    margin: 0 auto;
    display: inherit;
    min-height: 300px;
    max-width: 800px;
  }
  .previewVideo {
    height: 550px;
    .video-js {
      background: #fff;
    }
  }

  .no-video {
    display: none;
  }
}
</style>
<style>
.seach-tab .el-checkbox-button__inner:hover {
  color: var(--colorH1);
}
#advancedSearch-List
  label.el-checkbox-button.is-checked
  .el-checkbox-button__inner:hover {
  color: #fff;
}

.yesrD .el-date-editor.el-input {
  width: 120px;
}
#advancedSearch-List .seach-type-text .text-ul .yesrD span {
  margin-right: 0;
}
#advancedSearch-List .el-select .el-input {
  width: 105px;
  text-align: center;
}
#advancedSearch-List .el-select .el-input input {
  text-align: center;
}
#advancedSearch-List .el-tabs__item {
  transition: all 0.3s;
}
#advancedSearch-List .el-tabs__item.is-active {
  color: #fff !important;
  background: var(--colorH1);
}
#advancedSearch-List .el-tabs__item:hover {
  background: var(--colorH1);
  color: #fff !important;
}
#advancedSearch-List .el-tag.el-tag--danger {
  margin: 10px;
}
#advancedSearch-List .el-tabs.el-tabs--card.el-tabs--top {
  position: relative;
}
.file-Video .vjs-custom-skin > .video-js .vjs-big-play-button {
  font-size: 7.5em;
  display: none;
}
.file-Video .video-js {
  max-height: 109px;
}
.file-Video video {
  width: 100%;
  height: 100%;
}
.file-Video {
  position: relative;
  cursor: pointer;
}
.video-shaow {
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
div#educationnewsPage .webheart {
  width: auto;
  margin-top: 0px;
}
div#educationnewsPage
  #advancedSearch-List
  .seach-content
  .list--wrap-item
  .r-txt {
  width: 94%;
}
</style>
